<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>光伏运维生成管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
     <link rel="stylesheet" type="text/css" href="css/lhh_lib.css">
    <link rel="stylesheet" type="text/css" href="css/zh_style.css">
    <script type="text/javascript" src="js/config.js"></script>
    <style type="text/css">
        body.content{padding: 0;}
        .container-fluid{padding-right: 0;}
    </style>
</head>
<body class="content">
<div class="row _lhh_breadcrumb MB10 visible-lg PL15">
    <ul class="breadcrumb pull-left">
        <li><a href="index.html">首页</a></li>
        <li class="active">当日电量</li>
    </ul>
    <div class="p-rel">
        <div class="_lhh_breadcrumb-more MR15">
            <!--电子时钟 begin-->
            <include file="./include/clock.html" dataType="html"></include>
            <!--电子时钟 end-->
        </div>
    </div>
</div>
<div class="w-page">
    <div class="container-fluid">
        <ul class="row _zh_power" id="topInfo">
            <li class="col-md-3">
                <div class="_zh_power-powerImg">
                    <i class="_zh_power-icon _zh_power-icon-a blue"></i>
                </div>
                <div class="_zh_power-powerFont">
                    <p>电站1</p>
                    <p class="font-14 bold">8888.88kWh</p>
                    <p>最大发电量</p>
                </div>
            </li>
            <li class="col-md-3">
                <div class="_zh_power-powerImg">
                    <i class="_zh_power-icon _zh_power-icon-b green"></i>
                </div>
                <div class="_zh_power-powerFont">
                    <p>电站1</p>
                    <p class="font-14 bold">0.0kWh</p>
                    <p>最小发电量</p>
                </div>
            </li>
            <li class="col-md-3">
                <div class="_zh_power-powerImg">
                    <i class="_zh_power-icon _zh_power-icon-a red"></i>
                </div>
                <div class="_zh_power-powerFont">
                    <p>电站1</p>
                    <p class="font-14 bold">0.0%</p>
                    <p>最低发电效率</p>
                </div>
            </li>
            <li class="col-md-3">
                <div class="_zh_power-powerImg">
                    <i class="_zh_power-icon _zh_power-icon-b yellow"></i>
                </div>
                <div class="_zh_power-powerFont">
                    <p>电站1</p>
                    <p class="font-14 bold">36.1℃</p>
                    <p>最高温度</p>
                </div>
            </li>
        </ul>
    </div>
    <div class="_zh_summary">
        <i class="_zh_icon-i edit"></i>
        <p><span class="font-grey">汇总 ：</span>异常设备<span>2</span>个（输出功率异常<span class="font-red">0</span>个，温度过高<span class="font-red">1</span>个，通讯故障<span class="font-red">1</span>个）</p>
    </div>
    <div class="container-fluid">
        <ul class="row _zh_stationWrap" id="electricalBox">
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站1</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站2</p>
                        <span class="_zh_circleImg _zh_circleImg-yellow"></span>温度过高
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站3</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站4</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站5</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站6</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站7</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站8</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站9</p>
                        <span class="_zh_circleImg _zh_circleImg-purple"></span>通讯故障
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
            <li class="_zh_station col-sm-6 col-md-3">
                <div style="height:41px;">
                    <i class="_zh_station-stationicon"></i>
                    <div class="_zh_station-title">
                        <p class="MB5">电站10</p>
                        <span class="_zh_circleImg _zh_circleImg-green"></span>正常
                    </div>
                </div>
                <div class="_zh_station-c">
                    <div class="text1">
                        <p>输出功率</p>
                        <p>输入功率</p>
                        <p>单瓦发电量</p>
                        <p>日发电量</p>
                    </div>
                    <div class="data-value">
                        <p>88.8kW</p>
                        <p>88.88kW</p>
                        <p>42Wh</p>
                        <p>88.88kWh</p>
                    </div>
                </div>
                <div class="_zh_station-lineicon"></div>
            </li>
        </ul>
    </div>
</div>
</body>
<script type="text/javascript">
    LAMJS.main(function() {
        'use strict';
        var System = this;
        System.import([
                    '/use',
                    '/use-inverter'
                ],'./js');
    });
</script>
<script type="text/javascript">
    LAMJS.run(function() {
        'use strict';
        var System = this;
        System.Html.include($('include'));

        var I=System.modules.exports.I;

        function initInverterData(){
            I.ElectricalBox.getInverterData({
                '$view':$('#electricalBox'),
                'type': 'post',
                'url':  'js/dataJson-data.json',
                'init_fun':function(v){
                    var tpl=[];

                    tpl.push('<li class="_zh_station col-sm-6 col-md-3" id="s_'+ v._id +'">');
                    tpl.push('<div style="height:41px;">');
                    tpl.push('<i class="_zh_station-stationicon"></i>');
                    tpl.push('<div class="_zh_station-title">');
                    tpl.push('<p class="MB5">'+ v.url+'</p>');
                    tpl.push('<span class="_zh_circleImg _zh_circleImg-green"></span>正常');
                    tpl.push('</div>');
                    tpl.push('</div>');
                    tpl.push('<div class="_zh_station-c">');
                    tpl.push('<div class="text1">');
                    tpl.push('<p>输出功率</p>');
                    tpl.push('<p>输入功率</p>');
                    tpl.push('<p>单瓦发电量</p>');
                    tpl.push('<p>日发电量</p>');
                    tpl.push('</div>');
                    tpl.push('<div class="data-value">');
                    tpl.push('<p>'+ v.DCP +'kW</p>');
                    tpl.push('<p>88.88kW</p>');
                    tpl.push('<p>42Wh</p>');
                    tpl.push('<p>'+ v.daytotal +'kWh</p>');
                    tpl.push('</div>');
                    tpl.push('</div>');
                    tpl.push('<div class="_zh_station-lineicon"></div>');
                    tpl.push('</li>');

                    return tpl.join('');
                }
            });

            window.setInterval(function(){
                I.ElectricalBox.getInverterData({
                    'type': 'post',
                    'url':  'js/dataJson-data.json',
                    'data': {},
                    'getCurTpl':function(D){
                        var tpl, i,len= D.data.length, v;

                        for(i=0;i<len;i++){
                            tpl=[];
                            v= D.data[i];
                            if(!System.empty( v['_id'])){
                                tpl.push('<p>222</p>');
                                tpl.push('<p>88.88kW</p>');
                                tpl.push('<p>42Wh</p>');
                                tpl.push('<p>42WhkWh</p>');

                            }

                            $('#s_'+v['_id']+' .data-value').html(tpl.join(''));

                        }

                    }
                });
            },5000);
        }


        function getInverterData(){
            $('#electricalBox').delegate('li','click',function(){
                var _this_=this;
                $.ajax({
                    type: 'post',
                    url:  $(_this_).attr('url') || 'js/dataJson-data.json',
                    data: {},
                    dataType: 'json',
                    error:function(){
                        throw new Error("Warning :没有取到数据！！！");
                    },
                    success: function(D){
                        var tpl=[];
                        var v=[
                            {'title':'s1','kwh':'111.222','b':'s1最大发电量'},
                            {'title':'s2','kwh':'22.222','b':'s2最大发电量'},
                            {'title':'s3','kwh':'33.222','b':'s3最大发电量'},
                            {'title':'s4','kwh':'444.222','b':'s4最大发电量'}
                        ];
                        $('#topInfo ._zh_power-powerFont').each(function(i){
                            tpl=[];
                            tpl.push('<p>'+v[i].title+'</p>');
                            tpl.push('<p class="font-14 bold">'+v[i].kwh+'kWh</p>');
                            tpl.push('<p>'+v[i].b+'</p>');

                            $(this).html(tpl.join(''));

                        });

                    }
                });
            });
        }


        $(function(){
            initInverterData();
            getInverterData();
        });

    });
</script>
</html>

